<div class="bjui-pageHeader">
    <form id="pagerForm" data-toggle="ajaxsearch"
          action="${request.getContextPath()}/SpecailDefectTrends/specailDefectTrends" method="post">
        <div class="bjui-searchBar">
            <g:hiddenField name="SYS_QUERY_NAME" value="specailDefectTrends"/>
            <g:hiddenField name="EXPORT_CONTENT_NAME" value="Excel"/>
            <label>产品方向：</label>
            <g:select name="partFX" from="${endDefectTrendsPartfx}" data-toggle="selectpicker" data-width="130"
                      data-live-search="true" optionKey="KEY_ID" optionValue="TEXT" value="${partFX}"
                      noSelection="['': '-- All --']"/>&nbsp;
            <label>产品编码：</label>
            <input type="text" name="partName" value="${partName}" size="16" placeholder="产品编码"/>&nbsp;
            <label>批号：</label>
            <input type="text" name="batchid" value="${batchid}" size="16" placeholder="批号"/>&nbsp;
            <label>不良类型：</label>
            <input type="text" name="defectcode" value="${defectcode}" size="16" placeholder="不良类型"/>
            <br/><br/>
            %{--<label>产品编码：</label>&nbsp;
            <input type="text" name="partName"  value="${partName}"/>
            <label>产品名称：</label>&nbsp;
            <input type="text" name="partDesc" value="${partDesc}"/>
            <label>产品图号：</label>&nbsp;
            <input type="text" name="group3" value="${group3}"/>
            <label>工序编码：</label>&nbsp;
            <input type="text" name="stepName" value="${stepName}"/>
            <label>工序名称：</label>&nbsp;
            <input type="text" name="stepDesc" value="${stepDesc}"/><br/>
            <label>大组类：</label>&nbsp;
            <input type="text" name="totalGroup" value="${totalGroup}"/>
            <label>小分类：</label>&nbsp;
            <input type="text" name="detailCate" value="${detailCate}"/>
            <label>批次号：</label>&nbsp;
            <input type="text" name="lotId" value="${lotId}"/>--}%
            <label>时间段：</label>
            <input type="text" name="startTime" value="${startTime}" data-pattern="yyyy-MM-dd" size="12"
                   data-toggle="datepicker" placeholder="FROM">
            <input type="text" name="endTime" value="${endTime}" data-pattern="yyyy-MM-dd" size="12"
                   data-toggle="datepicker" placeholder="TO">&nbsp;
            <button type="submit" class="btn-default" data-icon="search">查询</button>&nbsp;
            <button type="button" class="btn-blue"
                    onclick="javascript:bjuiExportExl('#pagerForm', '${request.getContextPath()}/SpecailDefectTrends/exportExcel')"
                    data-icon="file-excel-o" title="导出Excel">导出</button>
        </div>
    </form>
</div>

<div class="bjui-pageContent tableContent">
    <g:if test="${specailDefectTrends.size() > 1}">
        <div id="specailDefectTrends" style="width:96%;height:58%;"></div>
        <script src="${request.getContextPath()}/js/echarts/echarts.js"></script>
        <script src="${request.getContextPath()}/js/echarts/echarts-tool.js"></script>
        <script type="text/javascript">
            // 基于准备好的dom，初始化echarts实例
            var contextPath = "${request.getContextPath()}";
            eChartsTool.init(contextPath);
            var data = [];
            <g:each in="${specailDefectTrends}" status="i" var="tableInstance">
            data.push('${tableInstance.DEFECT_CODE}');
            </g:each>

            // 指定图表的配置项和数据
            var option = {
                /*backgroundColor: 'rgba(0,0,0,0)', // 工具箱背景颜色*/
                // 图表标题
                toolbox: {

                    show: true,

                    feature: {

                        saveAsImage: {

                            show: true,

                            excludeComponents: ['toolbox'],

                            pixelRatio: 2

                        }
                    }

                },
                title: {},

                tooltip: {
                    trigger: ''
                },

                legend: {
                    data: ['缺陷数量', '缺陷占比']

                },
                xAxis: {
                    data: data
                },
                yAxis: [
                    {
                        type: 'value'
                    },
                    {
                        type: 'value',
                        name: '缺陷占比',

                        axislabel: {
                            formatter: '{value}%'
                        },
                        show: true
                    }
                ],
                series: [
                    {
                        name: '缺陷数量',
                        type: 'bar',
                        data:${specailDefectTrends.DEFECT_COUNT}
                    },
                    {
                        name: '缺陷占比',
                        type: 'line',
                        data:${specailDefectTrends.DEFEC_ratio},
                        yAxisIndex: 1
                    }]
            };
            eChartsTool.setOption("roma", document.getElementById('specailDefectTrends'), option);
        </script>
        <div style="margin: 40px auto;">
        <table data-toggle="tablefixed" data-width="96%" data-nowrap="true">
            <thead>
            <tr id="t1">
            <g:each in="${tableHeadList}" status="j" var="headInstance">
                <g:if test="${headInstance != 'RN'}">
                    <th width="125"><g:message code="${headInstance}" default="${headInstance}"/></th>
                </g:if>
            </g:each>
            <th>累计比(%)</th>
            </tr>
        </thead>
        <tbody>
        <g:if test="${specailDefectTrends.size() > 1}">
            <g:each in="${specailDefectTrends}" status="i" var="dataInstance">
                <tr>
                    <g:each in="${tableHeadList}" status="j" var="headInstance">
                        <g:if test="${headInstance != 'RN'}">
                            <td>${dataInstance["${headInstance}"]}</td>
                        </g:if>
                    </g:each>
                    <td>${list[i]}</td>
                </tr>
            </g:each>
        </g:if>
        </tbody>
        </table>
    </g:if>
    <g:else>
    <g:render template="../template/emptyPanel" />
    </g:else>
</div>
</div>
<g:render template="../template/pagination"/>

<script>
    $(function () {
        /*获取当页正常数量的小计*/
        var progressN = 0
        for (var i = 1; i <=${specailDefectTrends.size()}; i++) {
            var progressNo = 'progressNormal' + i
            var progressNor = $("td[name='" + progressNo + "']").text() == '' ? 0 : parseInt($("td[name='" + progressNo + "']").text());
            progressN += progressNor
        }
        $("#normalShow").html(progressN);

        /*获取当页返修数量的小计*/
        var progressR = 0
        for (var i = 1; i <=${specailDefectTrends.size()}; i++) {
            var progressRe = 'progressRework' + i
            var progressRew = $("td[name='" + progressRe + "']").text() == '' ? 0 : parseInt($("td[name='" + progressRe + "']").text());
            progressR += progressRew
        }

        $("#reworkShow").html(progressR);

        /*获取当页外协数量的小计*/
        var progressO = 0
        for (var i = 1; i <=${specailDefectTrends.size()}; i++) {
            var progressOr = 'progressOrc' + i
            var progressOrc = $("td[name='" + progressOr + "']").text() == '' ? 0 : parseInt($("td[name='" + progressOr + "']").text());
            progressO += progressOrc
        }
        $("#orcShow").html(progressO);

        /*获取当页报废数量的小计*/
        var progressS = 0
        for (var i = 1; i <=${specailDefectTrends.size()}; i++) {
            var progressSc = 'progressScrap' + i
            var progressScr = $("td[name='" + progressSc + "']").text() == '' ? 0 : parseInt($("td[name='" + progressSc + "']").text());
            progressS += progressScr
        }
        $("#scrapShow").html(progressS);


    })
</script>
%{--<script>
    $(function(){


        var progressWait=0;
        var progressRun=0;
        var progressHold=0;
        var progressRepair=0;
        var progressOutsrc=0;
        var progressScrap=0;
        var progressStepSum=0;
        for(var i=0;i<${partProgress.size()};i++){

            var progresswait='PROGRESSWAIT'+i
            var progressWaitAdd=$("td[name='"+progresswait+"']").text()==''?0:parseInt($("td[name='"+progresswait+"']").text());
            progressWait+=progressWaitAdd;

            var progressrun='PROGRESSRUN'+i
            var progressRunAdd=$("td[name='"+progressrun+"']").text()==''?0:parseInt($("td[name='"+progressrun+"']").text());
            progressRun+=progressRunAdd;

            var progresshold='PROGRESSHOLD'+i
            var progressHoldAdd=$("td[name='"+progresshold+"']").text()==''?0:parseInt($("td[name='"+progresshold+"']").text());
            progressHold+=progressHoldAdd;

            var progressrepair='PROGRESSREPAIR'+i
            var progressRepairAdd=$("td[name='"+progressrepair+"']").text()==''?0:parseInt($("td[name='"+progressrepair+"']").text());
            progressRepair+=progressRepairAdd;
//
            var progressoutsrc='PROGRESSOUTSRC'+i
            var progressOutsrcAdd=$("td[name='"+progressoutsrc+"']").text()==''?0:parseInt($("td[name='"+progressoutsrc+"']").text());
            progressOutsrc+=progressOutsrcAdd;

            var progressscrap='PROGRESSSCRAP'+i
            var progressScrapAdd=$("td[name='"+progressscrap+"']").text()==''?0:parseInt($("td[name='"+progressscrap+"']").text());
            progressScrap+=progressScrapAdd;

            var progressstepsum='PROGRESSSTEPSUM'+i
            var progressStepSumAdd=$("td[name='"+progressstepsum+"']").text()==''?0:parseInt($("td[name='"+progressstepsum+"']").text());
            progressStepSum+=progressStepSumAdd;


        }



        $("td[name='progressWaitShow']").html(progressWait);
        $("td[name='progressRunShow']").html(progressRun);
        $("td[name='progressHoldShow']").html(progressHold);
        $("td[name='progressRepairShow']").html(progressRepair);
        $("td[name='progressOutsrcShow']").html(progressOutsrc);
        $("td[name='progressScrapShow']").html(progressScrap);
        $("td[name='progressStepSum']").html(progressStepSum);



    })
</script>--}%
